<template>
  <customizeDialog
    title="审核"
    :visible="isDialog"
    width="500px"
    top="40px"
    @update:visible="isDialog = $event"
  >
    <el-form :model="form" label-width="80px">
      <el-form-item label="审核结果" prop="checkStatus">
        <el-radio-group v-model="form.checkStatus">
          <el-radio
            :label="item.value"
            v-for="item in checkStatusList"
            :key="item.value"
            >{{ item.label }}</el-radio
          >
          <!-- <el-radio :label="3">退回</el-radio> -->
        </el-radio-group>
      </el-form-item>
      <el-form-item label="审核意见">
        <el-input
          type="textarea"
          v-model="form.checkOpinion"
          maxlength="50"
          show-word-limit
          rows="5"
        ></el-input>
      </el-form-item>
    </el-form>
    <template slot="footer">
      <el-button @click="handleCancel">取 消</el-button>
      <el-button type="primary" @click="handleSumbit"
        >确 定</el-button
      >
    </template>
  </customizeDialog>
</template>

<script>
import { setRecordCheck } from '@/api/projectRecord'
import { queryOptions } from '@/api/dict'
import customizeDialog from '@/components/checkHistory/customizeDialog'
export default {
  name: 'shenhe',
  components: { customizeDialog },
  data() {
    return {
      isDialog: false,
      form: {
        pkid: '',
        stage: '',
        checkStatus: '2',
        checkOpinion: ''
      },
      checkStatusList: []
    }
  },
  async created() {
    await this.getStatusOptions()
  },
  methods: {
    changeDialog(data, stage) {
      console.log(data)
      this.form.pkid = data.value.project.pkid
      this.form.stage = stage
      this.isDialog = true
    },
    initData() {
      this.form = {
        pkid: '',
        stage: '',
        checkStatus: 2,
        checkOpinion: ''
      }
    },
    handleCancel() {
      this.initData()
      this.isDialog = false
    },
    handleSumbit() {
      setRecordCheck(this.form)
        .then((res) => {
          this.isDialog = false
          this.initData()
          // this.$emit('forceRender')
          this.$router.back()
          this.$message.success('审核成功')
        })
        .catch((err) => {
          this.isDialog = false
          this.$router.back()
          this.$message.error('审核失败')
        })
    },
    getStatusOptions() {
      queryOptions('clshcz').then((res) => {
        this.checkStatusList = res.data.map((item) => {
          return {
            label: item.dictText,
            value: item.dictValue
          }
        })
        console.log(this.checkStatusList)
      })
    }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-dialog__header {
  background: #597182;
  font-size: 16px;
  .el-dialog__title {
    color: #ffffff;
  }
}
.cancel {
  width: 80px;
  height: 34px;
  border: 1px solid #497fa3;
  font-size: 14px;
  font-weight: 400;
  color: #497fa3;
}
.sumbit {
  width: 80px;
  height: 34px;
  background: #497fa3;
  box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
}
</style>
